<template>
    <el-dialog
        title="核销店员列表"
        :close-on-click-modal="false"
        :visible.sync="visible"
        width="1100px"
    >
        <div class="mod-config">
            <el-table
                :data="dataList"
                border
                v-loading="dataListLoading"
                style="width: 100%"
            >
                <el-table-column
                    prop="id"
                    header-align="center"
                    align="center"
                    label="序号"
                    width="65"
                />
                <el-table-column
                    prop="storeName"
                    header-align="center"
                    align="center"
                    label="门店名称"
                />
                <el-table-column
                    prop="nickName"
                    header-align="center"
                    align="center"
                    label="店员名称"
                />
                <el-table-column
                    prop="headImgUrl"
                    header-align="center"
                    align="center"
                    label="店员头像"
                >
                    <template slot-scope="scope">
                        <img :src="scope.row.headImgUrl" />
                    </template>
                </el-table-column>
                <el-table-column
                    prop="createTime"
                    header-align="center"
                    align="center"
                    label="创建时间"
                />
                <el-table-column
                    fixed="right"
                    header-align="center"
                    align="center"
                    width="150"
                    label="操作"
                >
                    <template slot-scope="scope">
                        <el-button
                            type="text"
                            size="small"
                            @click="deleteHandle(scope.row.id)"
                            >删除</el-button
                        >
                    </template>
                </el-table-column>
            </el-table>
        </div>
    </el-dialog>
</template>

<script>
export default {
    data() {
        return {
            visible: false,
            dataForm: {
                key: "",
            },
            dataList: [],
            pageIndex: 1,
            pageSize: 10,
            totalPage: 0,
            dataListLoading: false,
            dataListSelections: [],
            addOrUpdateVisible: false,
        };
    },
    methods: {
        init(id) {
            this.dataForm.id = id || 0;
            this.visible = true;
            this.getDataList(id);
        },
        // 获取数据列表
        async getDataList() {
            this.dataListLoading = true;
            let { data } = await this.$http({
                url: this.$http.adornUrl('/activity/storeoperator/getList/'+ this.dataForm.id),
                method: "get",
                params: this.$http.adornParams({
                    page: this.pageIndex,
                    limit: this.pageSize,
                    key: this.dataForm.key,
                }),
            });
            if (data && data.code === 0) {
                this.dataList = data.storeList || [];
                this.totalPage = data.storeList.length;
            } else {
                this.dataList = [];
                this.totalPage = 0;
            }
            this.dataListLoading = false;
        },
        // 删除
        deleteHandle(id) {
            var ids = id
                ? [id]
                : this.dataListSelections.map((item) => {
                      return item.id;
                  });
            this.$confirm(
                `确定对[id=${ids.join(",")}]进行[${
                    id ? "删除" : "批量删除"
                }]操作?`,
                "提示",
                {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning",
                }
            ).then(() => {
                this.$http({
                    url: this.$http.adornUrl("/activity/storeoperator/delete"),
                    method: "post",
                    data: this.$http.adornData(ids, false),
                }).then(({ data }) => {
                    if (data && data.code === 0) {
                        this.$message({
                            message: "操作成功",
                            type: "success",
                            duration: 1500,
                            onClose: () => {
                                this.getDataList();
                            },
                        });
                    } else {
                        this.$message.error(data.msg);
                    }
                });
            });
        },
    },
};
</script>
